import { computed, reactive, ref, toRefs } from 'vue'
import { useStore } from 'vuex'
const useLoadMore = <D>(actionName: string, actionParams: {
  pageSize: number,
  currentPage: number
}, extraParams: any = {}) => {
  const store = useStore()
  const total = ref(0)
  const state = reactive({
    pageSize: actionParams.pageSize,
    currentPage: actionParams.currentPage
  })
  const loadMoreData = () => {
    console.log('extraParams', extraParams)
    store.dispatch(actionName, {
      ...extraParams,
      ...state
    }).then((res) => {
      state.currentPage++
      total.value = res.count
    })
  }
  const isLastPage = computed(() => {
    return state.currentPage > Math.ceil(total.value / state.pageSize)
  })
  return {
    loadMoreData,
    isLastPage
  }
}
export default useLoadMore
